<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  <title>The News Times</title>
  <link rel="stylesheet" href="./news.css" />
</head>

<body>
  <header class="brand-header">
    <h1 class="brand">The News Times</h1>
  </header>

  <section class="row">
    <article class="story quarter">
      <h1 class="article-title">Student Learns HTML</h1>
      <p class="article-text">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Hic ad in quas alias non! Expedita similique et dolore illum
        doloremque vel accusantium ut eos tempora sequi, doloribus vitae mollitia praesentium ex ullam? Dolorem labore fugiat
        neque nostrum porro vero fugit.</p>
      <p class="article-text">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aliquam corrupti, eius odio neque incidunt esse fuga veritatis
        ipsum, eligendi mollitia, porro quasi provident nisi sit! Doloribus, eligendi nemo, ad laudantium cupiditate aspernatur
        eveniet asperiores modi praesentium voluptas eos sunt odio.</p>
    </article>
    <article class="story half">
      <h1 class="article-title">BREAKING: Puppies Are Adorable</h1>
      <img class="article-img" src="http://placecorgi.com/500/250" />
      <p class="article-text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quos, dolores? Illo dolores, rerum iste aut porro doloribus
        fugit itaque voluptas.</p>
      <p class="article-text">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Laudantium incidunt ullam ea magni ipsam perferendis ratione
        pariatur enim repellendus quia?</p>
    </article>
    <article class="story quarter">
      <h1 class="article-title">CSS Is Apparently a Thing</h1>
      <p class="article-text">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Hic ad in quas alias non! Expedita similique et dolore illum
        doloremque vel accusantium ut eos tempora sequi, doloribus vitae mollitia praesentium ex ullam? Dolorem labore fugiat
        neque nostrum porro vero fugit.</p>
      <p class="article-text">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aliquam corrupti, eius odio neque incidunt esse fuga veritatis
        ipsum, eligendi mollitia, porro quasi provident nisi sit! Doloribus, eligendi nemo, ad laudantium cupiditate aspernatur
        eveniet asperiores modi praesentium voluptas eos sunt odio.</p>
    </article>
  </section>
  <section class="row">
    <article class="story quarter">
      <h1 class="article-title">Boy Likes Turtles</h1>
      <p class="article-text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque, perferendis! Accusamus asperiores quod vitae architecto
        natus alias fugiat aliquam unde sint expedita repellat rerum, obcaecati hic placeat recusandae quaerat. Dolores excepturi
        earum minus magni! Animi aperiam eligendi molestias necessitatibus ducimus.</p>
      <p class="article-text">Voluptate, ut, cupiditate ducimus vitae blanditiis ex impedit debitis est tempora dolores nam sed. Esse nobis ea inventore
        qui enim quia beatae ab commodi laboriosam quam aliquam aut perspiciatis fuga nam rerum temporibus voluptatum explicabo
        voluptate, pariatur ullam laudantium eligendi.</p>
    </article>
    <ul class="story three-quarter other-sections">
      <li class="site-section site-section-politics">
        <a href="#" class="section-link">
          Politics
        </a>
      </li>
      <li class="site-section site-section-tech">
        <a href="#" class="section-link">
          Technology
        </a>
      </li>
      <li class="site-section site-section-local">
        <a href="#" class="section-link">
          Local
        </a>
      </li>
      <li class="site-section site-section-opinion">
        <a href="#" class="section-link">
          Opinion
        </a>
      </li>
      <li class="site-section site-section-sports">
        <a href="#" class="section-link">
          Sports
        </a>
      </li>
    </ul>
  </section>
</body>

</html>